<template>
    <div class="mian-box">
        <websitetop :active="2"></websitetop>
        <div class="banner">
            <el-carousel height="960px">
                <el-carousel-item v-for="item in 4" :key="item">
                  <h3 class="small">{{ item }}</h3>
                </el-carousel-item>
            </el-carousel>
        </div>
        <div class="body-box">
            <div class="box-one">
                <div class="box-title">
                    <div style="margin: 0 auto;margin-top: 139px;">企业级SaaS行业痛点</div>
                </div>
                <div class="text-h33">
                    <div>集成、个性化及安全问题</div>
                </div>
                <div class="box-mian">
                    <div class="box-mian-bigbox">
                        <div class="service-small-box">
                            <div class="service-img">
                                <img style="width: 100%;height: 100%;" src="../../assets/img/home/img29.png" alt="">
                            </div>
                            <div class="service-text">系统集成</div>
                            <div class="service-text-box">
                                目前，市场缺乏产品、平台、技术、品牌、销售、咨询、异构系统集成解决方案，项目总包交付、运维支持整个链条为行业短板。
                            </div>
                        </div>
                        <div class="service-small-box" style="margin-left: 43px;margin-right: 43px;">
                            <div class="service-img">
                                <img style="width: 100%;height: 100%;" src="../../assets/img/home/img30.png" alt="">
                            </div>
                            <div class="service-text">个性化需求</div>
                            <div class="service-text-box">
                                企业用户在选择SaaS考虑因素中，近40%企业会考虑个性化需求，因为SaaS大都为标品服务，所以SaaS是否能满足不同企业独特需求以及如何平衡也是一大挑战。
                            </div>
                        </div>
                        <div class="service-small-box">
                            <div class="service-img">
                                <img style="width: 100%;height: 100%;" src="../../assets/img/home/img31.png" alt="">
                            </div>
                            <div class="service-text">安全问题</div>
                            <div class="service-text-box">
                                由于多租户的使用，使得SaaS平台承载着大量企业运营相关信息，企业必须要从管理、技术及法律层面给予客户安全保障，确保客户数据的安全性才能长久提供服务。
                            </div>
                        </div>
                    </div>
                    
                </div>
            </div>
            <div class="box-one" style="background-color: #fff;">
                <div class="box-title">
                    <div style="margin: 0 auto;margin-top: 139px;">全自主、全闭环、全链路政企级私域SaaS架构</div>
                </div>
                <div class="text-h33">
                    <div>为供应链金融、大数据、区块链、生态构建而生</div>
                </div>
                <div class="box-mian flex-center">
                    <div class="big-img">
                        <img style="width: 100%;height: 100%;" src="../../assets/img/home/img06.png" alt="">
                    </div>
                    
                </div>
            </div>
            <div class="box-one">
                <div class="box-title">
                    <div style="margin: 0 auto;margin-top: 139px;">产品优势</div>
                </div>
                <div class="box-mian flex-center" style="margin-top: 121px;">
                    <div class="cp-bigbox">
                        <div class="cp-box">
                            <div class="cp-bigtext">多</div>
                            <div class="cp-smalltext">云仓供应链，客户自营商品轻松管理，提供全球供应链商品协同增收</div>
                        </div>
                        <div class="cp-box">
                            <div class="cp-bigtext">好</div>
                            <div class="cp-smalltext">前置机私有化部署，流量、数据、客   流、资金，全部由客户掌控</div>
                            
                        </div>
                    </div>
                    <div class="cp-bigbox">
                        <div class="cp-box" style="margin-left: 139px;">
                            <div class="cp-bigtext">快</div>
                            <div class="cp-smalltext">基于微信小程序成熟生态，开箱即用，常规部署周期2-4周</div>
                        </div>
                        <div class="cp-box" style="margin-left: 139px;">
                            <div class="cp-bigtext">省</div>
                            <div class="cp-smalltext">一站式技术集成、一站式运营托管，按服务和效果计费</div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="box-one" style="background-color: #fff;">
                <div class="box-title">
                    <div style="margin: 0 auto;margin-top: 139px;">赋能三核心</div>
                </div>
                <div class="box-mian">
                    <div class="box-mian-bigbox">
                        <div class="small-box">
                            <div class="small-box-title">云仓</div>
                            <div class="small-box-value">全球云仓供应链</div>
                            <div class="small-box-textbox">
                                <div class="small-box-textbox-text">通过先进数字化&nbsp;&nbsp;手段，与全国保税仓/全球海外仓实现互联，集成全球优质品牌和产品。汇聚一般贸易、保税、直邮全模式数万种全球优品，助的优质消费品，助力重庆国际消费中心城市全球品牌聚集和提档升级。汇聚一般贸易、保税、直邮全模式数万种全球优品，助力实体企业实现零库存、轻库存，升级智慧柔性供应链。<br>&nbsp;&nbsp;一带一路、西部陆海新通道、RCEP相关国家的优质消费品，助力重庆国际消费中心城市全球品牌聚集和提档升级。
                                </div>
                            </div>
                        </div>
                        <div class="small-box" style="margin-left: 43px;margin-right: 43px;">
                            <div class="small-box-title">云店</div>
                            <div class="small-box-value">新零售店铺矩阵</div>
                            <div class="small-box-textbox">
                                <div class="small-box-textbox-text">通过SaaS云店技术，以知品屋实体旗舰店为核心，为&nbsp;&nbsp;协同业态实体店提供云店铺，通过一个二维码，“千店千面”整合实体线下流量，形成一站式“全球优质商品消费+吃喝玩乐商圈私域生态”。
                                    此外，也为集团和行业客户提供高度可定制的集采、批发、员工福利等整体解决方案。
                                </div>
                            </div>
                        </div>
                        <div class="small-box">
                            <div class="small-box-title">云服务</div>
                            <div class="small-box-value">一站式全链路运营服务</div>
                            <div class="small-box-textbox">
                                <div class="small-box-textbox-text">一站式提供线上线下整合营销和运营推广服务，包括但不限于设计、策      划、选品、活动、客服、融媒体服务      等。
                                    从传统的交付软件，革新升级为交付解决方案和实现客户成功。
                                </div>
                            </div>
                        </div>
                    </div>
                    
                </div>
            </div>
            <div class="box-one">
                <div class="box-title">
                    <div style="margin: 0 auto;margin-top: 139px;">云仓——全球云仓供应链</div>
                </div>
                <div class="box-mian">
                    <div class="box-mian-bigbox">
                        <div class="img-box" style="width: 652px;height: 571px;">
                            <img style="width: 100%;height: 100%;" src="../../assets/img/home/img02.png" alt="">
                        </div>
                        <div class="box-mian-text">
                            通过先进数字化手段，与全国保税仓/全球海外仓实现互联，集成全球优质品牌和产品。汇聚一般贸易、保税、直邮全模式数万种全球优品，助力实体企业实现零库存、轻库存，升级智慧柔性供应链。
重点聚焦一带一路、西部陆海新通道、RCEP相关国家的优质消费品，助力重庆国际消费中心城市全球品牌聚集和提档升级。
                        </div>
                    </div>
                    
                </div>
            </div>
            <div class="box-one" style="background: #fff;">
                <div class="box-title">
                    <div style="margin: 0 auto;margin-top: 139px;">云店——新零售店铺矩阵</div>
                </div>
                <div class="box-mian">
                    <div class="box-mian-bigbox">
                        <div class="img-box" style="width: 861px;height: 496px;">
                            <img style="width: 100%;height: 100%;" src="../../assets/img/home/img03.png" alt="">
                        </div>
                        <div class="box-mian-text">
                            通过SaaS云店技术，以知品屋实体旗舰店为核心，为协同业态实体店提供云店铺，通过一个二维码“千店千面”整合实体线下流量，形成一站式“全球优质商品消费+吃喝玩乐商圈私域生态”。<br>此外，也为集团和行业客户提供高度可定制的集采、批发、员工福利等整体解决方案。
                        </div>
                    </div>
                    
                </div>
            </div>
            <div class="box-one">
                <div class="box-title">
                    <div style="margin: 0 auto;margin-top: 139px;">云服务——一站式全链路代运营服务</div>
                </div>
                <div class="box-mian">
                    <div class="box-mian-bigbox">
                        <div class="img-box" style="width: 647px;height: 463px;">
                            <img style="width: 100%;height: 100%;" src="../../assets/img/home/img04.png" alt="">
                        </div>
                        <div class="box-mian-text">
                            一站式提供线上线下整合营销和运营推广服务，包括但不限于设计、策划、选品、活动、客服、融媒体服务等。从传统的交付软件，革新升级为交付解决方案和实现客户成功。
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    import websitetop from './websitetop'
    export default {
        components: {
            websitetop
        },
        data() {
            return {

            }
        },
        created() {

        },
        methods: {

        }
    }
</script>

<style lang="scss" scoped>
    .mian-box {
        width: 100%;
        height: 100%;
        background-color: #fff;
    }
    
    .banner {}
    
    .body-box {
        display: flex;
        flex-direction: column;
    }
    
    .box-one {
        height: 900px;
        background: #F4F4F8;
        min-width: 1280px;
    }
    
    .box-title {
        display: flex;
        font-size: 51px;
        color: #1F1F1F;
        font-weight: 700;
        font-family: Source Han Sans CN;
    }
    
    .box-mian {
        display: flex;
        margin: 0 auto;
    }
    
    .img-box {
        width: 715px;
        height: 443px;
    }
    
    .box-mian-text {
        width: 527px;
        height: 250px;
        font-size: 21px;
        font-family: Source Han Sans CN;
        font-weight: 400;
        color: #1F1F1F;
        line-height: 50px;
        margin-left: 41px;
    }
    
    .box-mian-bigbox {
        margin: 0 auto;
        display: flex;
        align-items: center;
        margin-top: 105px;
    }
    
    .small-box {
        width: 398px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
    .small-box-title {
        color: #2B2F79;
        font-size: 42px;
        font-weight: 700;
    }
    
    .small-box-value {
        margin-top: 27px;
        font-size: 27px;
        color: #323232;
    }
    
    .small-box-textbox {
        margin-top: 45px;
        background: #F4F4F8;
        border-radius: 15px;
        height: 374px;
        width: 100%;
    }
    
    .small-box-textbox-text {
        font-size: 17px;
        color: #323232;
        line-height: 31px;
        width: 306px;
        margin: 0 auto;
        margin-top: 19px;
    }
    
    .small-box-img {
        width: 398px;
        height: 200px;
    }
    
    .text-h19 {
        font-size: 19px;
        font-weight: 700;
        color: #323232;
        line-height: 30px;
    }
    
    .text-h15 {
        margin-top: 15px;
        font-size: 15px;
        line-height: 25px;
        color: #323232;
        display: -webkit-box;
        /* 将对象作为弹性伸缩盒子模型显示 */
        -webkit-line-clamp: 2;
        /* 控制最多显示几行 */
        -webkit-box-orient: vertical;
        /* 设置或检索伸缩盒对象的子元素的排列方式 */
        overflow: hidden;
    }
    
    .next {
        margin-top: 15px;
        font-size: 15px;
        color: #323232;
        cursor: pointer;
    }
    
    .footer-box {
        height: 490px;
        background: #2B2F79;
        min-width: 1280px;
    }
    
    .footer-box-btn {
        margin: 0 auto;
        margin-top: 94px;
        width: 283px;
        height: 61px;
        background: #FFFFFF;
        border-radius: 31px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .footer-text {
        font-size: 29px;
        color: #1F1F1F;
    }
    
    .text-h33 {
        color: #2B2F79;
        font-weight: 700;
        font-size: 33px;
        margin-top: 31px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .service-small-box {
        width: 398px;
        height: 419px;
        background: #FFFFFF;
        border-radius: 15px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .service-img {
        margin-top: 59px;
        width: 63px;
        height: 63px;
    }
    
    .service-text {
        font-size: 29px;
        font-weight: 500;
        color: #1F1F1F;
        margin-top: 34px;
    }
    
    .service-text-box {
        margin-top: 33px;
        width: 305px;
        font-size: 17px;
        color: #323232;
        line-height: 31px;
    }
    
    .big-img {
        margin-top: 31px;
        width: 1326px;
        height: 577px;
    }
    
    .flex-center {
        display: flex;
        justify-content: center;
    }
    
    .cp-bigbox {
        display: flex;
        flex-direction: column;
    }
    
    .cp-box {
        width: 576px;
        height: 212px;
        background: #FFFFFF;
        box-shadow: 0px 3px 10px 0px rgba(72, 72, 72, 0.2);
        border-radius: 15px;
        margin-bottom: 39px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .cp-bigtext {
        font-size: 100px;
        color: #2B2F79;
        font-weight: 700;
    }
    
    .cp-smalltext {
        width: 347px;
        font-size: 21px;
        color: #323232;
        line-height: 42px;
        margin-left: 45px;
    }
</style>